import 'package:flutter/material.dart';

class TabControllerExample2 extends StatefulWidget {
  @override
  _TabControllerExample2State createState() => _TabControllerExample2State();
}

class MemuNode {
  final String title;
  final Color color;
  MemuNode({this.title, this.color});
}

class _TabControllerExample2State extends State<TabControllerExample2>
    with TickerProviderStateMixin {
  final List<MemuNode> tabs = [
    MemuNode(title: "Tab1", color: Colors.red),
    MemuNode(title: "TabTab22", color: Colors.green),
    MemuNode(title: "Tab3", color: Colors.yellow),
    MemuNode(title: "Tab4", color: Colors.red[300]),
  ];

  TabController _tabController;

  @override
  void initState() {
    _tabController = TabController(length: tabs.length, vsync: this);
    _tabController.addListener(() {
      print(this._tabController.toString());
      print(this._tabController.index);
      print(this._tabController.length);
      print(this._tabController.previousIndex);
    });
    super.initState();
  }

  @override
  void dispose() {
    _tabController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("TabControllerExample"),
      ),
      body: Column(
        children: [
          Container(
            height: 55,
            color: Colors.black12,
            child: Row(
              children: [
                Expanded(
                  child: ListView(
                    scrollDirection: Axis.horizontal,
                    children: tabs.map((MemuNode e) {
                      return Container(
                        color: e.color,
                        child: Row(
                          children: [
                            Text(
                              e.title,
                              maxLines: 1,
                              overflow: TextOverflow.ellipsis,
                            ),
                            IconButton(
                                icon: Icon(Icons.close), onPressed: () {})
                          ],
                        ),
                      );
                    }).toList(),
                  ),
                ),
                IconButton(icon: Icon(Icons.refresh), onPressed: () {})
              ],
            ),
          ),
          Expanded(
            child: TabBarView(
                controller: _tabController,
                children: tabs.map((MemuNode e) {
                  return Center(child: Text(e.title));
                }).toList()),
          ),
        ],
      ),
    );
  }
}
